<%--
  Created by IntelliJ IDEA.
  User: 28593
  Date: 2022/10/31
  Time: 20:19
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Json</title>
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.6.1.min.js"></script>

<script type="text/javascript">
    function testJson(){
        // 获取输入的值pname为id
        var pname =$("#pname").val();
        var password=$("#password").val();
        var page=$("#page").val();
        $.ajax({
            // 请求路径
            url:"${pageContext.request.contextPath}/testJson",
            type:"post",
            data:JSON.stringify({pname:pname,password:password,page:page}),
            contentType:"application/json;charset=utf-8",
            dataType:"json",
            success:function (data){
                if (data!=null){
                    alert("输入的用户名："+data.pname+"密码："+data.password+"年龄: "+data.page);
                }
            }
        })
    }
</script>
</head>
<body>
<form action="">
    用户名：<input type="text" name="pname" id="pname"/>
    密码：<input type="password" name="password" id="password"/>
    年龄：<input type="text" name="page" id="page">
    <input type="button" value="测试" onclick="testJson()"/>
</form>
</body>
</html>
